<style>
    .anniuyesi {
        border-bottom: solid 1px #eceeef;
        margin-bottom: 20px;
    }

    .anniuyesi a {
        border: solid 1px #eceeef;
        border-width: 1px 1px 0;
        display: inline-block;
        padding: 10px;
        color: #777;
        background-color: #fff;
        position: relative;
    }

    .anniuyesi .mod {
        background-color: #fd9f02;
        color: #fff;
        border: solid 1px #fd9f02;
    }

    .select-group .btn:not(.btn-link):not(.btn-circle) {
        border: 1px solid #ddd;
    }
</style>
<titlemenu></titlemenu>
<div class="dj-card">
    <div class="dj-body" activate-input>
        <div class="anniuyesi">
            <a href="javascript:void(0)" ng-class="{'mod':step==1}" ng-click="tabChange(1)">基础信息</a>
            <a href="javascript:void(0)" ng-class="{'mod':step==2}" ng-click="tabChange(2)">培训班课程</a>
        </div>
        <div ng-show="step==1">
            <form role="form" name="trainingClassForm" novalidate>
                <div panel-title data-title="'基础信息'"></div>
                <div class="dj-formtable">
                    <table class="dj-table dj-table3">
                        <tr>
                            <th>培训班名称<span style="color: red;">*</span></th>
                            <td ng-class="{ 'has-error' : this.trainingClassForm.trainingClassName.$invalid &&  this.trainingClassForm.$submitted}">
                                <input type="text" name="trainingClassName" ng-model="dataModel.trainingClassName"
                                       maxlength="250" autocomplete="off" autoclose="true"
                                       class="form-control" ng-required="true"/>
                                <span ng-show="this.trainingClassForm.trainingClassName.$invalid &&  this.trainingClassForm.$submitted"
                                      class="error">必填.</span>
                            </td>
                            <th>培训时间<span style="color: red;">*</span></th>
                            <td ng-class="{ 'has-error' : (this.trainingClassForm.beginDate.$invalid || this.trainingClassForm.endDate.$invalid) &&  this.trainingClassForm.$submitted}">
                                <input style="width: 90px;display: inline;" name="beginDate" class="form-control"
                                       autocomplete="off" autoclose="true"
                                       data-date-format="yyyy-MM-dd" data-date-type="date"
                                       ng-model="dataModel.beginDate"
                                       ng-required="true" ng-change="getDateDiffDay()"
                                       placeholder="" bs-datepicker/>
                                ~
                                <input style="width: 90px;display: inline;" name="endDate" class="form-control"
                                       autocomplete="off" autoclose="true"
                                       data-date-format="yyyy-MM-dd" data-date-type="date"
                                       ng-model="dataModel.endDate"
                                       ng-required="true" ng-change="getDateDiffDay()"
                                       placeholder="" bs-datepicker/>
                                <span ng-show="(this.trainingClassForm.beginDate.$invalid || this.trainingClassForm.endDate.$invalid) &&  this.trainingClassForm.$submitted"
                                      class="error">必填.</span>
                            </td>
                            <th>培训天数</th>
                            <td>{{dataModel.dateDiffDay}}</td>
                        </tr>
                        <tr>
                            <th>录入组织<span style="color: red;">*</span></th>
                            <td ng-class="{ 'has-error' : this.trainingClassForm.dzzmc.$invalid &&  this.trainingClassForm.$submitted}">
                                <div class="input-group input-group-search"
                                     title="录入组织" ng-click="selectParty()">
                                    <input name="dzzmc" type="text" ng-model="dataModel.dzzmc"
                                           autocomplete="off" autoclose="true"
                                           class="form-control" ng-required="true"
                                           ng-disabled="true"/>
                                    <span class="input-group-addon"><i class="material-icons">search</i></span>
                                </div>
                                <span ng-show="this.trainingClassForm.dzzmc.$invalid &&  this.trainingClassForm.$submitted"
                                      class="error">必填.</span>
                            </td>
                            <th>培训详情地址</th>
                            <td colspan="3"
                                ng-class="{ 'has-error' : this.trainingClassForm.address.$invalid &&  this.trainingClassForm.$submitted}">
                                <div class="form-group" style="margin-bottom: 4px;margin-top: 5px;">
                                    <div class="form-line select-group" style="padding-bottom: 1px;">
                                        <select ng-model="dataModel.address"
                                                ng-options="type as type for type in addressList"
                                                class="form-control"
                                                name="addressSelect">
                                        </select>
                                    </div>
                                    <div class="form-line" style="width: 97%;margin-top: -29px;z-index: 9;"
                                         ng-class="{ 'focused error' : this.trainingClassForm.address.$invalid &&  this.trainingClassForm.$submitted}">
                                        <input type="text" name="address"
                                               ng-model="dataModel.address"
                                               maxlength="500"
                                               autocomplete="off" autoclose="true"
                                               class="form-control"/>
                                    </div>
                                    <span ng-show="this.trainingClassForm.address.$invalid &&  this.trainingClassForm.$submitted"
                                          class="error">必填.</span>
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <th>主办部门<span style="color: red;">*</span></th>
                            <td ng-class="{ 'has-error' : this.trainingClassForm.department.$invalid &&  this.trainingClassForm.$submitted}">
                                <input type="text" name="department" ng-model="dataModel.department"
                                       autocomplete="off" autoclose="true"
                                       class="form-control" ng-required="true"/>
                                <span ng-show="this.trainingClassForm.department.$invalid &&  this.trainingClassForm.$submitted"
                                      class="error">必填.</span>
                            </td>
                            <th>联系人</th>
                            <td>
                                <input type="text" name="contactName" ng-model="dataModel.contactName"
                                       autocomplete="off" autoclose="true"
                                       class="form-control"/>
                            </td>
                            <th>联系方式</th>
                            <td>
                                <input type="text" name="phone"
                                       autocomplete="off" autoclose="true"
                                       ng-model="dataModel.phone" class="form-control"
                                       placeholder="手机"/>
                            </td>
                        </tr>
                        <tr>
                            <th>培训内容</th>
                            <td colspan="5">
                                <textarea class="form-control" ng-model="dataModel.content" rows="5"></textarea>
                            </td>
                        </tr>
                    </table>
                </div>
                <div panel-title data-title="'参培人员信息'"></div>
                <div class="dj-formtable">
                    <div class="table-responsive list-table-panel">
                        <div class="list-table-title" style="background-color: white;">
                            <div class="table-title">
                                参培人数：{{dataModel.userList.length}}人
                            </div>
                            <div class="table-tool">
                                <button type="button" style="margin-left: 10px;" class="btn btn-default1" data-dataoptions="selectUserlist"
                                        bsselectdata-pro>批量选择学员
                                </button>
                                <button type="button" style="margin-left: 10px;" class="btn btn-default1"
                                        ng-click="importUser()">批量导入
                                </button>
                            </div>
                        </div>
                        <table class="gt-table gt-table-bordered">
                            <thead>
                            <tr>
                                <th class="th-rownum"><div>序号</div></th>
                                <th>所在支部</th>
                                <th>姓名</th>
                                <th>性别</th>
                                <th>手机号码</th>
                                <th>操作</th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr ng-repeat="it in dataModel.userList">
                                <td class="text-center">{{$index + 1}}</td>
                                <td class="text-center">{{it.dzzmc}}</td>
                                <td class="text-center">{{it.userName}}</td>
                                <td class="text-center">{{it.gender}}</td>
                                <td class="text-center">{{it.phone}}</td>
                                <td class="text-center">
                                    <button class="btn td-btn bg-pink waves-effect"
                                            ng-click="delUser($index)">
                                        删除
                                    </button>
                                </td>
                            </tr>
                            <tr ng-if="dataModel.userList.length<=0">
                                <td colspan="8" style="text-align:center">暂无数据</td>
                            </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
                <div class="form_foot" style="margin-top: 30px;">
                    <button type="button" class="btn btn-default" ng-click="pagechange();">取消</button>
                    <button type="submit" class="btn btn-primary" ng-click="save(this.trainingClassForm.$valid)">保存并下一步
                    </button>
                </div>
            </form>
        </div>
        <div ng-if="step==2">
            <div ng-include="'../main/train/trainingClass/course.html'"
                 ng-controller="pxTrainingClassCourseListCtrl"></div>
            <div class="form_foot">
                <button type="button" class="btn btn-default" ng-click="pagechange();">完成</button>
                <button type="button" class="btn btn-primary" ng-click="stepNext(-1)">上一步</button>
            </div>
        </div>
    </div>
</div>